/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  Button,
  Vibration,
  NativeModules,
  DeviceEventEmitter,
  ToastAndroid
} from 'react-native';
import { StackNavigator } from 'react-navigation';
import BarcodeScanner from 'react-native-barcodescanner';

var DeviceEventEmitterModule = NativeModules.DeviceEventEmitterModule;



class HomeScreen extends React.Component {
  componentWillMount(){
    DeviceEventEmitter.addListener('EventName',(events) =>{
      // this.setState({
      //   walletSum : events.walletSum
      // });
      ToastAndroid.show(events.key, ToastAndroid.SHORT)
    }); 
  }
  static navigationOptions = {
    headerTitle: 'Welcome',
  };
  render() {
    const { navigate } = this.props.navigation;
    return (
      <View>
        <Text onPress = {
          ()=>{
            alert(1)
          }
        }>Hello, Chat ! 阿斯顿发生</Text>
        <Button
          onPress={() => navigate('Chat')}
          title="Chat with Lucy"
        />
        <Button
        color="#841584"
        title="事件传递"
        onPress = {
          ()=>{
            DeviceEventEmitterModule.getTime();
          }
        }
         />
      </View>
    );
  }
}

class ChatScreen extends React.Component {
  static navigationOptions = {
    title: 'Chat with Lucy',
  };
  render() {
    return (
      <View>
        <Text>Chat with Lucy</Text>
      </View>
    );
  }
}

class BarcodeScannerApp extends Component {
  constructor(props) {
    super(props);
    this.state = {
      barcode: '',
      cameraType: 'back',
      text: 'Scan Barcode',
      torchMode: 'off',
      type: '',
    };
  }
  render() {
    return (
      <View style={styles.container}>
        <BarcodeScanner
          onBarCodeRead={this.barcodeReceived.bind(this)}
          style={{ flex: 1 }}
          torchMode={this.state.torchMode}
          cameraType={this.state.cameraType}
        />
        <View style={styles.statusBar}>
          <Text style={styles.statusBarText}>{this.state.text}</Text>
        </View>
      </View>
    );
  }
  barcodeReceived(e) {
    if (e.data !== this.state.barcode || e.type !== this.state.type) {
      this.setState({
        barcode: e.data,
        text: `${e.data}(${e.type})`,
        type: e.type,
      });
    }
  }
}


var styles = StyleSheet.create({
  container: {
    flex: 1
  },
  statusBar: {
    height: 100,
    alignItems: 'center',
    justifyContent: 'center',
  },
  statusBarText: {
    fontSize: 20,
  }
})

export const SimpleApp = StackNavigator({
  Home: { screen: HomeScreen },
  Chat: { screen: ChatScreen },
});

export const SimpleApp1 = StackNavigator({
  Chat: { screen: ChatScreen },
});


// AppRegistry.registerComponent('rn1', () => SimpleApp1);

AppRegistry.registerComponent('rn', () => SimpleApp);

// AppRegistry.registerComponent('rn', () => BarcodeScannerApp);